<!DOCTYPE html>

<html lang="en">
	<head>
		<meta charset="utf-8" />
		<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<meta name="description" content="ActionBarSherlock is an extension of the compatibility library designed to facilitate the use of the action bar design pattern across all versions of Android leveraging the best API available." />

		<title>ActionBarSherlock - Home</title>

		<!--[if lte IE 9]><link rel="stylesheet" href="static/ie.css" type="text/css" media="screen" /><![endif]-->
		<link rel="stylesheet" href="static/1120.css" type="text/css" media="screen" />
		<link rel="stylesheet" href="static/styles.css" type="text/css" media="screen" />

		<script type="text/javascript" src="static/css3-mediaqueries.js"></script><!-- http://code.google.com/p/css3-mediaqueries-js/ -->
		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
		<script type="text/javascript" src="static/jquery.cross-slide.min.js"></script>
		<script type="text/javascript">

			$(function() {
				$.getJSON('https://api.github.com/repos/JakeWharton/ActionBarSherlock/tags?callback=?', function(response) {
					var meta = response.meta
					  , data = response.data
					;

					data.sort(function(o1, o2) {
						return (o1.name < o2.name) ? -1 : 1;
					});

					var last = data[data.length - 1];
					$('#latest-version').html('v' + last.name);
					$('#latest-zip').attr('href', last.zipball_url);
					$('#latest-tarball').attr('href', last.tarball_url);
				});

				$('#feature-images').crossSlide({
					sleep: 3,
					fade: 1,
				}, [
					{ src: 'static/feature_01.png' },
					{ src: 'static/feature_02.png' },
					{ src: 'static/feature_03.png' },
				]).css('height', '400px');
			});
		</script>
	</head>
	<body id="home">
		<div class="container">
			<div class="row">
				<div class="half" id="feature">
					<p id="header"><a class="img" href="index.html"><img src="static/logo.png" alt="Home"/></a></p>
					<p class="lead">ActionBarSherlock is an extension of the <a href="http://developer.android.com/sdk/compatibility-library.html">compatibility library</a> designed to facilitate the use of the action bar design pattern across all versions of Android with a single API.</p>
					<div id="sherlock"><a href="merch-and-donations.html"><img src="static/mascot.png" alt="Donations &amp; Merhandise" title="Buy me on a shirt!"/></a></div>
					<p>The library will automatically use the native action bar when appropriate or will automatically wrap a custom implementation around your layouts. This allows you to easily develop an application with an action bar for every version of Android from 2.x and up.</p>
					<div id="download">
						<p><span>Download <span id="latest-version"></span>:</span> <a id="latest-zip" href="https://github.com/JakeWharton/ActionBarSherlock/downloads">Zip</a> <a id="latest-tarball" href="https://github.com/JakeWharton/ActionBarSherlock/downloads">Tarball</a> <a id="download_more" href="download.html">More...</a></p>
					</div>
				</div>
				<div id="feature-images" class="half last">
					<img src="static/feature_01.png"/>
				</div>
			</div>

			<div class="row" id="features">
				<div class="fourth feature">
					<h1><a href="usage.html">Usage</a></h1>
					<p>Interaction with the action bar is provided through a single API by calling <code>getSupportActionBar()</code>. The methods provided by this interface mirror those of the native action bar exactly.</p>
					<p>Enabling support is as simple as extending your activities from one of the 'Sherlock' base activities and declaring a theme in your manifest file.</p>
					<p><a href="usage.html">Learn More &raquo;</a></p>
				</div>
				<div class="fourth feature">
					<h1><a href="theming.html">Theming</a></h1>
					<p>A single theme can be used to style the action bar to match the look and feel of your application.</p>
					<p>If you need to customize the look for a phone or tablet, Android's powerful resource filtering can still be leveraged.</p>
					<p><a href="theming.html">Learn More &raquo;</a></p>
				</div>
				<div class="fourth feature">
					<h1><a href="samples.html">Samples</a></h1>
					<p>View screenshots and descriptions of the three sample applications which are bundled with the project as well as open source applications who chose to implement the library.</p>
					<p>Each project links to its source so you can investigate their code for reference.</p>
					<p><a href="samples.html">Learn More &raquo;</a></p>
				</div>
				<div class="fourth last feature">
					<h1>Resources</h1>
					<dl>
						<dt><a href="faq.html">Frequently Asked Questions</a></dt>
						<dd>Common pitfals and their solutions.</dd>
						<dt><a href="support.html">Help &amp; Support</a></dt>
						<dd>Places to go when you need assistance with implementation.</dd>
						<dt><a href="development.html">Development</a></dt>
						<dd>Contribute to the libary.</dd>
						<dt><a href="merch-and-donations.html">Merchandise &amp; Donations</a></dt>
						<dd>Show support by purchasing a shirt with our mascot and/or donate directly!</dd>
					</dl>
				</div>
			</div>

			<div class="row" id="apps">
				<div class="whole">
					<h1>Featured Implementations</h1>
				</div>
				<div class="whole">
					<div class="half app">
						<img src="static/apps/com.squareup.cardcase.png"/>
						<div class="info">
							<h4>Pay with Square</h4>
							<p class="desc">Pay with your name using Square. Leave your wallet at home and simply give your name at checkout. Find businesses you love, share favorites and be rewarded.</p>
							<p class="links"><a href="https://play.google.com/store/apps/details?id=com.squareup.cardcase">View on Play Market</a></p>
						</div>
					</div>
					<div class="half app last">
						<img src="static/apps/com.github.android.gauges.png"/>
						<div class="info">
							<h4>GitHub Gaug.es</h4>
							<p class="desc">Gaug.es is the most simple and beautiful way to track multiple sites and see live reporting on all of them from one convenient dashboard.</p>
							<p class="links"><a href="https://play.google.com/store/apps/details?id=com.github.mobile.gauges">View on Play Market</a> &middot; <a href="https://github.com/GitHub/gauges-android">View GitHub project</a></p>
						</div>
					</div>
				</div>
				<div class="whole">
					<div class="half app">
						<img src="static/apps/com.battlelancer.seriesguide.png"/>
						<div class="info">
							<h4>SeriesGuide Show Manager</h4>
							<p class="desc">Manage the progress of (re-)watching your favorite TV shows. Keep track of which episodes you still have to watch or which ones are upcoming.</p>
							<p class="links"><a href="https://play.google.com/store/apps/details?id=com.battlelancer.seriesguide">View on Play Market</a> &middot; <a href="https://github.com/UweTrottmann/SeriesGuide">View GitHub project</a></p>
						</div>
					</div>
					<div class="half app last">
						<img src="static/apps/com.androiduipatterns.mentionobserver.png"/>
						<div class="info">
							<h4>Mentions</h4>
							<p class="desc">Mentions will monitor twitter and reddit and keep you updated whenever someone has something to say.</p>
							<p class="links"><a href="https://play.google.com/store/apps/details?id=com.androiduipatterns.mentionobserver">View on Play Market</a></p>
						</div>
					</div>
				</div>
			</div>

			<div class="row" id="footer">
				<div class="half">
					<p>&copy; 2012 Jake Wharton <small>( <a href="http://twitter.com/JakeWharton">@</a> / <a href="http://profiles.google.com/jakewharton">+</a> )</small></p>
				</div>
				<div class="half last social">
					<g:plusone size="medium" href="http://actionbarsherlock.com"></g:plusone>
					<a href="http://twitter.com/share" class="twitter-share-button" data-url="http://actionbarsherlock.com" data-text="ActionBarSherlock - Action bar design pattern for all versions of Android." data-count="horizontal" data-via="JakeWharton">Tweet</a>
					<iframe src="http://www.facebook.com/plugins/like.php?app_id=186126341440594&amp;href=http%3A%2F%2Factionbarsherlock.com&amp;send=false&amp;layout=button_count&amp;width=90&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:90px; height:21px;" allowTransparency="true"></iframe>
					<a class="FlattrButton" style="display:none;" rev="flattr;button:compact;" href="http://actionbarsherlock.com"></a><noscript><a href="http://flattr.com/thing/320252/ActionBarSherlock" target="_blank"><img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a></noscript>
					<a id="github" href="https://github.com/JakeWharton/ActionBarSherlock"><img style="position: absolute; top: 0; right: 0; border: 0;" src="static/ribbon.png" alt="Fork me on GitHub"></a>
				</div>
			</div>
		</div>
		<script type="text/javascript">
			var _gauges = _gauges || [];
			(function() {
				var t   = document.createElement('script');
				t.type  = 'text/javascript';
				t.async = true;
				t.id    = 'gauges-tracker';
				t.setAttribute('data-site-id', '4f455953f5a1f51c10000075');
				t.src = '//secure.gaug.es/track.js';
				var s = document.getElementsByTagName('script')[0];
				s.parentNode.insertBefore(t, s);
			})();

			(function() {
				var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
				s.type = 'text/javascript';
				s.async = true;
				s.src = 'http://api.flattr.com/js/0.6/load.js?mode=auto';
				t.parentNode.insertBefore(s, t);
			})();

			(function() {
				var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
				s.type = 'text/javascript';
				s.async = true;
				s.src = 'http://apis.google.com/js/plusone.js';
				t.parentNode.insertBefore(s, t);
			})();

			(function() {
				var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
				s.type = 'text/javascript';
				s.async = true;
				s.src = 'http://platform.twitter.com/widgets.js';
				t.parentNode.insertBefore(s, t);
			})();
		</script>
	</body>
</html>
